<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>如何去写 vue 自定义指令</title>
</head>

<body>
  <script>
    // 注册全局的指令
    Vue.directive("focus", {
      // 当被绑定的元素插入到 DOM 中时……
      inserted: function (el) {
        // 聚焦元素
        el.focus();
      },
    });


    // 注册局部的指令
    directives: {
      focus: {
        // 指令的定义
        inserted: function (el) {
          el.focus()
        }
      }
    }



    // 注册过滤器
    // {{ message | capitalize }}
    filters: {
      capitalize: function (value) {
        if (!value) return ''
        value = value.toString()
        return value.charAt(0).toUpperCase() + value.slice(1)
      }
    }
  </script>
</body>

</html>